<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>DataGrid_EMP</title>
<script type="text/javascript" src="<c:url value="/js/jquery-easyui-1.5.4.2/jquery.min.js"/>"></script>
<script type="text/javascript" src="<c:url value="/js/jquery-easyui-1.5.4.2/jquery.easyui.min.js"/>"></script>
<script type="text/javascript" src="<c:url value="/js/jquery-easyui-1.5.4.2/locale/easyui-lang-zh_CN.js"/>"></script>
<link rel="stylesheet" href="<c:url value="/js/jquery-easyui-1.5.4.2/themes/default/easyui.css"/>" />
<link rel="stylesheet" href="<c:url value="/js/jquery-easyui-1.5.4.2/themes/icon.css"/>" />

</head>
<body>
	<script type="text/javascript">
		$(function(){
			$("#sel").linkbutton({onClick:function(){
				var row = $("#dg2").datagrid("getSelected");
				$.messager.alert('json', JSON.stringify(row));
			}});
			
			$("#lzh_emp_list_all").linkbutton({onClick:function(){
				//修改datagrid的url为get_all_emps_page_where
				$('#dg2').datagrid({pageNumber:1, url: 'get_all_emps_page'});
				//重新加载数据
				$('#dg2').datagrid('reload');
			}});
			
			$("#lzh_btn_emp_add").linkbutton({onClick:function(){
				$("#lzh-win-emp-add").window("open");
			}});
		});
	</script>
	<table id="dg2" class="easyui-datagrid"
		data-options="fit:true,border:false,
		toolbar:'#tb2',fitColumns:true,url:'get_all_emps_page',method:'get',singleSelect:true,
		rownumbers:true,pagination:true">
		<thead>
			<tr>
				<th data-options="field:'empno',width:1,checkbox:true">编号</th>
				<th data-options="field:'ename',width:2">姓名</th>
				<th data-options="field:'job',width:3">职务</th>
				<th data-options="field:'hiredate',width:4">入职日期</th>
				<th
					data-options="field:'sal',width:2,styler: function(value,row,index){
						if(value < 1000){
							return 'background:yellow;';
						}
					},formatter: function(value,row,index){
						if(value){
							return '￥' + value;
						}
				}
				">薪水</th>
				<th
					data-options="field:'deptVo',width:3,formatter: function(value,row,index){
					if(value){
						return value.dname;
					}else{
						return '/';
					}
				}">部门</th>
			</tr>
		</thead>
	</table>

	<div id="tb2">
		<a id="lzh_btn_emp_add" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true">添加</a>
		<a id="sel" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true">获取选择行的值</a>
		
		<input class="easyui-searchbox" data-options="width:250,label:'姓名：',labelWidth:55,
			searcher:function(value,name){
				//修改datagrid的url为get_all_emps_page_where
				$('#dg2').datagrid({pageNumber:1, url: 'get_all_emps_page_where'});
				//重新加载数据
				$('#dg2').datagrid('load', {key: value});
			}">
		<a id="lzh_emp_list_all" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search',plain:true">查看所有</a>
		<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-help',plain:true">关于</a>
	</div>
	
	<div id="lzh-win-emp-add" class="easyui-window" title="添加新员工" data-options="href:'to_emp_add_2', collapsible:false,minimizable:false,maximizable:false,modal:true,iconCls:'icon-save', closed: true" style="width:400px;height:300px;padding:5px;">
	</div>
</body>
</html>








